<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="imagetoolbar" content="false">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="description" content="">
    <meta name="author" content="">

    <link rel="icon" href="images/favicon.ico">

    <title>同昌官网</title>
    <!-- Bootstrap core CSS -->
    <link href="js/bootstrap-3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
    <link href="js/bootstrap-3.3.7/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
    <link href="js/bootstrapValidator/bootstrapValidator.css" rel="stylesheet">
                               

    <!-- custom style-->
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/index/index.css">

    <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
    <!--[if lt IE 9]>
    <script src="js/bootstrap-3.3.7/js/ie8-responsive-file-warning.js"></script><![endif]-->
    <script src="js/bootstrap-3.3.7/js/ie-emulation-modes-warning.js"></script>

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="js/bootstrap-3.3.7/js/html5shiv.min.js"></script>
    <script src="js/bootstrap-3.3.7/js/respond.min.js"></script>
    <![endif]-->
</head>
<body oncontextmenu="return false"  onselectstart="return false" style="overflow: hidden">
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
    <div class="modal-dialog"  style="width:410px;">
        <div class="modal-content" style="width:410px;">
            <div class="modal-body">
                <form class="form-signin" id="loginForm">
                    <div class="header row">
                        <div class="col-xs-4"><span></span></div>
                        <div class="col-xs-4 ">网站登录</div>
                        <div class="col-xs-4"><span></span></div>
                    </div>
                    <div class="form-group">
                        <span class="userLabel">用户名 <i></i></span>
                        <input type="text" class="form-control" name="username" id="userName" required autofocus
                               placeholder="请输入用户名"/>
                    </div>
                    <div class="form-group">
                        <span class="passwordLabel">密码 <i></i></span>
                        <input type="password" class="form-control" name="password" id="password" required
                               placeholder="请输入密码"/>
                    </div>
                    <div class="form-group">
                        <button type="submit" id="submitBtn" class="btn btn-lg btn-primary btn-block">登录</button>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>
<!-- load -->
<div class="loader">
    <div class="loader-img"></div>
</div>
<!-- content -->
<div class="wrapper">

    <!-- Top menu -->
    <nav class="navbar  navbar-no-bg" role="navigation">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                        data-target="#top-navbar-1">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">
                    <img alt="Brand" src="images/index/logo.png">
                </a>
            </div>
            <div class="collapse navbar-collapse" id="top-navbar-1">
                <ul class="nav navbar-nav navbar-right">
                    <li class="loginBtn" data-toggle="modal" data-target="#myModal">登录</li>
                    <li><a href="javascript:void(0);" class="line"></a></li>
<!--
                    <li class="searchBox"><a href="javascript:void(0);" class="searchIcon"></a><input type="text" class="form-control searchForm" placeholder="请输入搜索内容" style="display:inline"></li>
-->
                    <li class="wxBox"><a href="javascript:void(0);" class="weixin"></a><a href="javascript:void(0);" class="jtewm"></a></li>
                    <!--<li><a href="javascript:void(0);" class="en"></a></li>-->
                </ul>
            </div>
        </div>
    </nav>
    <div class="indexBg">
        <video style="height:100%;width:100%" muted class="videoBg">
            <source src="video/index/indexVideo.mp4" type="video/webm">
            <source src="video/index/indexVideo.mp4" type="video/mp4">>
         
        </video>
        <div style="position:absolute;top:0;left:0;height:100%;width: 100%;background:url(images/index/indeBgShadow.png) center center no-repeat;background-size:100% 100%;"></div>
    </div>
    <!--middle content-->
    <div class="indexContent">
        <div class="innerContent">
            <div class="middleContent">
                <div class="container">
                    <div class="row">
                        <div class="col-md-7">
                            <div class="textTitle">
                                <span>携</span><span>手</span><span>同</span><span>昌</span>&nbsp;&nbsp;&nbsp;&nbsp;<span>赋</span><span>能</span><span>未</span><span>来</span>
                            </div>
                            <div class="subtitle">创新驱动发展 <span class="videoBtn"></span></div>
                            <div class="menuItems">
                                <ul>
                                    <div class="row">
                                        <div class="col-sm-3">
                                            <li><span class="point"></span><a href="dqtc.html">大气天成</a>
                                            </li>
                                        </div>
                                        <div class="col-sm-3">
                                            <li><span class="point"></span><a href="djff.html">大将风范</a></li>
                                        </div>
                                        <div class="col-sm-3">
                                            <li><span class="point"></span><a href="dxwx.html">大象无形</a></li>
                                        </div>

                                    </div>
                                    <div class="row">
                                        <div class="col-sm-3">
                                            <li><span class="point"></span><a href="dcwo.html">大成无偶</a></li>
                                        </div>
                                        <div class="col-sm-3">
                                            <li><span class="point"></span><a href="dawj.html">大爱无疆</a></li>
                                        </div>
                                        <div class="col-sm-3">
                                            <li><span class="point"></span><a href="dyht.html">大业宏图</a></li>
                                        </div>
                                    </div>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <footer class="footer">
        <div class="container">
            <div class="">法律声明 | 监督举报 | 网站地图 | 晋网文【2018】6138-1456号</div>
            <div>Copyright 1996 - 2018 Topchance. All Rights Reserved.中科同昌信息技术集团</div>
        </div>
    </footer>
</div>
<!--展示宣传片-->
<!-- 公司宣传片 -->
<!--<div class="trailer">
    <div class="trailer-Video"></div>
</div>-->
<script src="js/jquery-v1.12.4/jquery.min.js"></script>
<!--vendor-->
<script>window.jQuery || document.write('<script src="js/bootstrap-3.3.7/js/jquery.min.js"><\/script>')</script>
<script src="js/bootstrapValidator/bootstrapValidator.min.js"></script>
<script src="js/bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script src="js/bootstrapValidator/zh_CN.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="js/bootstrap-3.3.7/js/ie10-viewport-bug-workaround.js"></script>
<!-- custom -->
<script src="js/common.js"></script>
<link rel="stylesheet" href="plugs/sweetalert2/sweetalert2.min.css">
<script src="plugs/sweetalert2/sweetalert2.all.min.js"></script>
<script src="plugs/layer/layer.js"></script>
<script>
    //加载视频动画
    function loadVIdeo() {
        $(".videoBg")[0].play();

    }
    window.onload = loadVIdeo;
    $(document).ready(function(){
        loadVIdeo();
		var username = window.sessionStorage.username;//获取绘话中的用户名
        if (username) {
            $(".loginBtn").html(username);
            $(".loginBtn").css({"color":"#333"});
            $(".loginBtn").attr("data-target"," ");
        } else {
            $(".loginBtn").html('登录');
            $(".loginBtn").attr("data-target","#myModal");
        }
        //防下载
        document.onkeydown = function() {
            var e = window.event || arguments[0];
            //屏蔽F12
            if(e.keyCode == 123) {
                return false;
                //屏蔽Ctrl+Shift+I
            } else if((e.ctrlKey) && (e.shiftKey) && (e.keyCode == 73)) {
                return false;
                //屏蔽Shift+F10
            } else if((e.shiftKey) && (e.keyCode == 121)){
                return false;

            } else if(event.ctrlKey  &&  window.event.keyCode==83 ){
                return false;
            }
        };
        //屏蔽右键单击
        document.oncontextmenu = function() {
            return false;
        }
    });
    $(function () {
        $("video")[0].play();
        // console.log($( $("video")))
        var indexBg = $(".indexBg");   //图片容器
        var textTitle = $(".textTitle");//文字容器
        loadTextOpacityIndex(textTitle);
        $(document).mousemove(function (e) {
            //背景图片移动
            getMousePos(e, indexBg);
        });

        //播放同昌宣传片
        $(".videoBtn").click(function () {

            layer.open({
                type: 1,
                title: false,
                area: ['100%', '100%'],
                scrollbar: false,
                skin: 'mylayer',
                content: ' <video style="width:100%; height:100%; object-fit: fill" autoplay="autoplay">\n' +
                '                        <source src="video/dqtc/video.mp4" type="video/webm">\n' +
                '                        <source src="video/dqtc/video.mp4" type="video/mp4">\n' +
                '                        对不起；您的浏览器不支持HTML5视频在WebM和VP8 / VP9或MP4\n' +
                '                    </video>',
                end: function () {
                    $('body').css('overflow-y', 'auto');
                }
            });
        });

        // modal  居中显示
        var $m_btn = $('.loginBtn');
        var $modal = $('#myModal');

        $modal.on('show.bs.modal', function () {
            var $this = $(this);
            var $modal_dialog = $this.find('.modal-dialog');
            // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
            $this.css('display', 'block');
            $modal_dialog.css({'margin-top': Math.max(0, ($(window).height() - $modal_dialog.height()) / 2)});
        });
        $('#myModal').on('shown.bs.modal', function () {
            $("#loginForm").bootstrapValidator({
                live: 'enabled',//验证时机，enabled是内容有变化就验证（默认），disabled和submitted是提交再验证
                excluded: [':disabled', ':hidden', ':not(:visible)'],//排除无需验证的控件，比如被禁用的或者被隐藏的
                submitButtons: '#submitBtn',//指定提交按钮，如果验证失败则变成disabled，但我没试成功，反而加了这句话非submit按钮也会提交到action指定页面
                message: '通用的验证失败消息',//好像从来没出现过
                feedbackIcons: {//根据验证结果显示的各种图标
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    username: {
                        message: '用户名验证失败',
                        validators: {
                            notEmpty: {
                                message: '用户名不能为空'
                            }
                        }
                    },
                    password: {
                        validators: {
                            /* regexp: {//正则验证
                                 regexp: /^[a-zA-Z0-9_\.]+$/,
                                 message: '所输入的字符不符要求'
                             },*/
                            notEmpty: {
                                message: '密码不能为空'
                            }
                        }
                    },
                }
            });
            $("#submitBtn").click(function (e) {
                e.preventDefault();
                $("#loginForm").bootstrapValidator('validate');//提交验证
                if ($("#loginForm").data('bootstrapValidator').isValid()) {
                    var username = $.trim($("#userName").val());
                    var password = $.trim($("#password").val());
                    $.ajax({
                        url: "http://localhost/eye/a/tcoa/login/manage",
                        type: "post",
                        data: {username: username, password: password},
                        success: function (data) {
                            if (data) {
                                data = JSON.stringify(data);
                                data = JSON.parse(data);
                                if (data.loginmark == 1) {
                                    $('#myModal').modal('hide');
                                    swal(
                                        '恭喜登录成功！',
                                    );


                                    // sessionStorage.useId = data.id;
                                    // alert(id);//保存用户名id
                                    sessionStorage.username = data.username;    //保存用户名
                                    //  alert()
                                    $(".loginBtn").html(data.username);
									 $(".loginBtn").css({"color":"#333"});
                                    $(".loginBtn").attr("data-target"," ");
                                }
                                if (data.loginmark == 2) {
                                     swal({
                                        title: '用户名或密码填写错误登录失败!',
                                        type: 'error',
                                        confirmButtonColor: '#3085d6',
                                        cancelButtonColor: '#d33',
                                        confirmButtonText: '确定',
                                        confirmButtonClass: 'btn btn-success',
                                        buttonsStyling: false ,

                                    }).then(function () {
                                        swal(
                                            '请重新核对填写信息',
                                             'info'
                                        )
                                    });
                                    //layer.alert('用户名或密码填写错误', {icon: 2});
                                    $("#loginForm").data("bootstrapValidator").destroy();
                                    $('#loginForm').data('bootstrapValidator', null);
                                    $("#loginForm")[0].reset();
                                }
                            }
                        },
                        error: function (xhr, data) {
                            swal('发送ajax失败');
                        },
                        complete: function () {
                            $("#loginForm").data("bootstrapValidator").destroy();
                            $('#loginForm').data('bootstrapValidator', null);
                            $("#loginForm")[0].reset();
                        }
                    })
                }

            });
        });
    })


</script>
</body>
</html>
